<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>登录页面</title>
</head>

<body>
    <form action="">
        用户名：<input type="text" id="username" name="username"><br>
        密码：<input type="password" id="password" name="password"><br>
        <button>登录</button>
    </form>
    <script>
        document.querySelector('form').onsubmit = function (e) {
            e.preventDefault();
            let username = document.getElementById('username').value;
            let password = document.getElementById('password').value;
            var xhr = new XMLHttpRequest();
            xhr.onload = function () {
                let res = JSON.parse(xhr.responseText);
                alert(res.msg);
                if (res.status === 200) {
                    location.href = '/index.html'
                }
            };
            xhr.open("POST", 'http://localhost:3000/api/login');
            xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded')
            xhr.send('username=' + username + '&password=' + password);
        }


    </script>

</body>

</html>